<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-touch-fullscreen" content="yes" />
<meta name="format-detection" content="telephone=no"/>
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no"/>
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,minimum-scale=1" />
<title>商品分类</title>
<link rel="stylesheet" type="text/css" href="/wap/e_tpl/css/base.css">
<link rel="stylesheet" type="text/css" href="/wap/e_tpl/css/nctouch_categroy.css">
<link rel="stylesheet" type="text/css" href="/wap/e_tpl/css/new.css">
<link rel="stylesheet" href="/wap/css/font-awesome.min.css">
</head>
<style>
	#header{
		height: 1.95rem;
	}
	#header .header-wrap{
		margin-top: 0;
	}
	.category-item{
		height: auto !important;
	}
	.ci-fcategory-name{
		width: 2.8rem;
		font-size: 12px;
		overflow: hidden;
		white-space: normal;
		height: auto !important;
	}
	.ci-fcategory-ico{
		display: none;
	}
	.category-item.selected .ci-fcategory-name{
		padding-bottom: 0;
	}
	.category-item{
		width: auto !important;
	}
	.category-item a{
		width: 100%;
		padding-top: 12px;
		padding-bottom: 12px;
	}
	.ci-fcategory-name{
		margin: 0 !important;
		border-bottom: 0 !important;
	}
	.categroy-list{
		padding-left: 0;
		padding-right: 0;
		padding: 0;
		width: 100% !important;
	}
	.ci-fcategory-name{
		width: auto !important;
	}
	.category-item{
		border-left: 2px solid transparent !important;
	}
	.category-item.selected{
		border-left:2px solid #ED5564 !important;
	}

</style>
<body>
<div class="nctouch-main-layout">
  <div class="categroy-cnt" id="categroy-cnt"></div>
  <div class="categroy-rgt" id="categroy-rgt"></div>
</div>
<!-- <div class="pre-loading">
  <div class="pre-block">
    <div class="spinner"><i></i></div>
    分类数据读取中... </div>
</div> -->
</body>
<script type="text/html" id="category-one">
	<ul class="categroy-list">
		<!-- <li class="category-item selected">
			<a href="javascript:void(0);" class="category-item-a brand">
					<div class="ci-fcategory-ico">
						<img src="../images/degault.png">
					</div>
				<div class="ci-fcategory-name">品牌推荐</div>
			</a>
		</li> -->
		<% for(var i = 0;i<class_list.length;i++){ %>
			<li class="category-item">
				<a href="javascript:void(0);" class="category-item-a category" date-id="<%= class_list[i].gc_id %>">
					<div class="ci-fcategory-ico">
						<img src="/wap/e_tpl/images/degault.png">
					</div>
					<div class="ci-fcategory-name"><%== class_list[i].gc_name; %></div>
				</a>
			</li>
		<% } %>
	</ul>
</script>
<script>
	function slide_item(t) {
		var dt = $(t).closest('dt');
		if(!dt.hasClass('switch-on')){
			dt.nextUntil("dt").slideUp(function () {
				dt.addClass('switch-on');
			});
		}
		else{
			dt.nextUntil("dt").slideDown(function () {
				dt.removeClass('switch-on');
			});
		}

//		.slideToggle()
	}
</script>
<script type="text/html" id="category-two">
	<dl class="categroy-child-list">
		<dt >
			<a class="show_all" href="javascript:;" style="color: #f60;font-size: 13px;padding-left: 5px;">查看该分类下所有商品</a>
		</dt>
		<% for(var i=0; i<class_list.length; i++) { var col = i % 10;%>
			<dt><a href="javascript:;"><i class="col<%= col %>"></i><span onclick="slide_item(this)"><%= class_list[i].gc_name %></span><i class="arrow-r" onclick="location.href='<%= WapSiteUrl %>/tmpl/product_list.html?gc_id=<%= class_list[i].gc_id %>'"></i></a></dt>
			<% if(class_list[i].child){ %>
				<% for(var j=0; j<class_list[i].child.length; j++) { %>
					<dd><a href="<%= WapSiteUrl %>/tmpl/product_list.html?gc_id=<%= class_list[i].child[j].gc_id %>"><%= class_list[i].child[j].gc_name %></a></dd>
				<% } %>
			<% } %>
		<% } %>
		<dt>
			<a href="javascript:"></a>
		</dt>
		<dt>
			<a href="javascript:"></a>
		</dt>
	</dl>
</script>
<!-- <script type="text/html" id="brand-one">
	<dl class="brands-recommend">
		<% for(var i = 0;i<brand_list.length;i++){ %>
			<dd>
				<a href="<%= WapSiteUrl %>/tmpl/product_list.html?b_id=<%= brand_list[i].brand_id %>">
					<img src="<%= brand_list[i].brand_pic %>">
					<p><%= brand_list[i].brand_name %></p>
				</a>
			</dd>
		<% } %>
	</dl>
</script> -->
<div id="footer"></div>
<script type="text/javascript" src="/wap/e_tpl/js/config.js"></script>
<script type="text/javascript" src="/wap/e_tpl/js/zepto.min.js"></script>
<script src="/data/resource/js/jquery.js"></script>
<script type="text/javascript" src="/wap/e_tpl/js/template.js"></script>
<script type="text/javascript" src="/wap/js/common.js"></script>
<script type="text/javascript" src="/wap/e_tpl/js/iscroll.js"></script>
<script type="text/javascript" src="/wap/e_tpl/js/tmpl/categroy-frist-list.js"></script>
<script type="text/javascript" src="/wap/js/tmpl/footer.js"></script>
<script>
	String.prototype.htmldecode = function()
	{
		var str = this;
		var s = "";
		if (str.length == 0) return "";
		s = str.replace(/&gt;/g, "&");
		s = s.replace(/&lt;/g, "<");
		s = s.replace(/&gt;/g, ">");
		s = s.replace(/&nbsp;/g, " ");
		s = s.replace(/&#39;/g, "\'");
		s = s.replace(/&quot;/g, "\"");
		s = s.replace(/<br>/g, "\n");
		return s;
	}
	$(document).on('click','.show_all',function () {
		var id = $('.category-item.selected').find('a').eq(0).attr('date-id');
		location.href = '/wap/tmpl/product_list.php?gc_id=' + id;
	})
</script>
</html>
